まずは出題するクイズの問題文と回答欄、および「回答する」ボタンを作成します。クイズの問題文は普通のテキストで作成し、回答欄と「回答する」ボタンはFORMのテキストボックスとボタンを使って作成します。このとき、FORMと解答欄にはname属性で名前を付けておくようにしてください。また「回答する」ボタンは、クリックされた際にJavaScript関数を呼び出さすようにonClickイベントを設定しておきます。 <FORM name="fo1"> Q1)日本で一番高い山は？<BR> <FONT size="2" color="#FF0000"> （答えを記入したあと、「回答する」ボタンをクリックしてください） </FONT><BR> 答え：<INPUT type="text" name="anser"> <INPUT type="button" value="回答する" onClick="check()"> </FORM> 上の例では、FORMタグに「fo1」という名前を、解答欄に「anser」という名前を付けています。また「回答する」ボタンにはonClickイベントを設定し、ボタンがクリックされると「check()」というJavaScript関数が呼び出されるようにしています。

次に回答欄に記入された回答が正解であるかを判定するJavaScript関数を作成します。関数内では、if文を使って解答欄に記述された内容がクイズの正解と一致しているかを判断し、一致している場合はWindow.location.replace()メソッドで（正解であることを示す）別のページへと移動させます。 <SCRIPT language="JavaScript"> <!-- function check(){ if (document.fo1.anser.value=="富士山") {window.location.href="./A1.html"} } //--> </SCRIPT> ここでは自作のJavaScript関数「check()」をHEADタグ内に記述します。if文にある「document.fo1.anser.value」には、先ほどFORMや解答欄に命名したのと同じ名前を記述するようにしてください。つまり「document.（FORMの名前）.（解答欄の名前）.value」と記述するわけです。これがクイズの回答と一致している場合（=="富士山"）の処理は、続けて{}内に記述します。{}内に「window.location.href="（ページのURL）"」と記述すれば、指定したページを表示させることができます。この例では同じフォルダにある「A1.html」というページをクイズの回答ページとして表示させます。

ここまでの作業で、とりあえずクイズのあるページは作成できました。しかし、回答が間違えであった場合の処理が何もありません。続けて回答が間違いであった場合の処理も追加しておきましょう。この作業は、先ほどのif文にelse処理を追加することにより実現できます。「残念、間違いです」などのalert表示を、間違えたときの処理として追加しておくとよいでしょう。以上で、クイズのあるページの作成は完了です。 <SCRIPT language="JavaScript"> <!-- function check(){ if (document.fo1.anser.value=="富士山") {window.location.href="./A1.html"} else {alert("残念、間違いです")} } //--> </SCRIPT> 先ほどのJavaScript関数「check()」に、「else {alert("残念、間違いです")}」の1文を追加します。elseは、if文の条件と一致しなかった場合の処理を記述するものであり、ここでは「残念、間違いです」というアラートを表示させるようにしています。 ここで紹介したテクニックを応用すれば、さまざまなクイズを作成することも可能となります。解答欄に別の名前をつけておけば、複数のクイズを一度に出題し、その正解率を表示させるページなども作成できるでしょう。いろいろと研究してみてください。

G�|�C���g�|�C���@Amazon Yahoo �y�V

�����z�[���y�[�W �y�V���o�C��[UNLIMIT��������1�~] �C�O�i���q���� �C�O���s�����������I